<template>
<div class="module-define">
    <div class="define-box">{{titleUpperCase}}</div>
</div>
</template>

<script type="text/babel">
    import Vue from 'vue';

    export default Vue.extend({
        props: {
            title: {
                type: String,
                default: ''
            }
        },
        computed: {
            titleUpperCase() {
                return this.title.toUpperCase();
            }
        },
        data() {
            return {

            }
        },
        created() {

        },
        methods: {

        }
    });
</script>

<style lang="sass" rel="stylesheet/scss">
    .module-define {
            background-color: #dde1e9;
        .define-box {
            box-sizing: border-box;
            min-height: 260px;
            line-height: 260px;
            /*background: url(./img/top-banner.png) center center no-repeat;*/
            background-image: url(./img/banner_bg.jpg);
            background-position: center center;
            background-repeat: no-repeat;
            background-size: auto 100%;
            color: #fff;
            font-size: 32px;
            text-align: center;
        }
    }
</style>